<template>
    <div>
        <!-- 用户授权弹出层 -->
        <el-dialog :close-on-click-modal="false" v-model="userShow" title="用户授权">
            <addForm />
        </el-dialog>
        <!-- 修改密码 -->
        <el-dialog :close-on-click-modal="false" v-model="changPwd" title="修改密码">
            <addForm />
        </el-dialog>
        <!--重置密码 -->
        <el-dialog :close-on-click-modal="false" v-model="resetPwd" title="重置密码">
            <addForm />
        </el-dialog>
    </div>
</template>

<script setup lang="ts">
import addForm from './addForm.vue';
import { computed } from 'vue';
//  定义接口类型
interface IProps{
    userShow:boolean,
    changPwd:boolean,
    resetPwd:boolean
}

interface IEmit {
    (e:'setUser' ,v:boolean):void;
    (e:'setCP' , v:boolean):void;
    (e:'setRP' , v:boolean) :void
}
//  声明类型
const props = defineProps<IProps>()
const emit = defineEmits<IEmit>()


//  控制user列表
const userShow = computed({
    get(){
        return props.userShow
    },
    set(v:boolean){
        emit('setUser' , v)
    }
})

//  修改密码
const changPwd = computed({
    get(){
        return props.changPwd
    },
    set(v:boolean){
        emit('setCP' , v)
    }
})

//  重置密码
const resetPwd = computed({
    get(){
        return props.resetPwd
    },
    set(v:boolean){
        emitb('setRP' , v)
    }
})

</script>

<style scoped lang="scss"></style>